<template>
  <nav class="nav headbar">
    <div class="nav-left">
      <a @click="back" v-if="!isHome"><i class="fa fa-chevron-left"></i></a>
    </div>
    <div class="nav-center">
      {{title}}
    </div>
    <div class="nav-right">

    </div>
  </nav>
</template>
<script>
export default {
  name: 'headbar',
  props: {
    title: {
      type: String,
      default: '闯奇贷'
    }
  },
  computed: {
    isHome () {
      if (!this.$route.meta) return false
      return this.$route.meta.home
    }
  },
  methods: {
    back () {
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="scss" scoped>
@import '~scss/base.scss';
.headbar{
  height: 40px;
  background: $active-color;
  position: fixed;
  top: 0;
  width: 100%;
  color: white;
  font-size: $nav-size;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 9999;
  .nav-left{
    margin-left: 10px;
  }
  .nav-right{
    margin-right: 10px;
  }
}
</style>

